<extend name="Public/baseConf"/>  
<block name="breadcrumb"> 
	<div class="row wrapper border-bottom white-bg page-heading">
	    <div class="col-lg-4">
	        <h2>手机图标管理</h2>
	        <ol class="breadcrumb">
	            <li><a href="{:U('index/index')}">首页</a></li>
	            <li class="active">
	                <strong><if condition="$data eq null">新增图标<else/>编辑图标({$data['name']})</if></strong>
	            </li>
	        </ol>
	    </div>
	    <div class="col-lg-6"></div>
	    <div class="col-lg-2">
            <div class="title-action">
           		<button class="btn btn-primary ajax-post" type="submit" target-form="form">
           		<i class="fa fa-pencil align-top"></i>确定
           		</button> 
            </div>
        </div>
	</div> 
</block>
<block name="body">
	<div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
	        <div class="col-lg-12">
	            <div class="ibox float-e-margins">
	                <div class="ibox-title">
	                    <h5>新增图标信息</h5>
	                    <div class="ibox-tools">
	                        <a class="collapse-link">
	                            <i class="fa fa-chevron-up"></i>
	                        </a>
	                    </div>
	                </div>
	                <div class="ibox-content">
		                <form action="{:U('savePicShow')}" method="post" class="form">
		                    <div class="row">
		                    	<input type="hidden" name="id" value="{$data['id']}"/>
								<input type="hidden" name="path" id="path" value="{$data['path']}"/>
		                        <div class="col-sm-4 b-r">
	                                <div class="form-group">
	                                	<label>图标名称</label> 
	                                	<input type="text" id="name" name="name" value="{$data['name']}" placeholder="必填项" class="form-control">
	                                </div>
	                                <div class="form-group"><label>是否显示</label> 
										<select id="type" name="type" class="form-control">
											<option value="是" <eq name="data['type']" value="是">selected</eq>>是</option>
											<option value="否" <eq name="data['type']" value="否">selected</eq>>否</option>
										</select>
									</div>
	                                <div class="form-group">
		                                <label>图标描述</label> 
		                                <input type="text" id="description" name="description" value="{$data['description']}" class="form-control">
		                            </div>
		                        </div>
		                        <div class="col-sm-4">
										<input type="file" id="upload_picture" align='center'> 
										<input type="hidden"  name="icon" id="icon" value=""/>
										<div class="image">
											<notempty name="data['id']"> 
												<img class="img-responsive" src="__ROOT__{$data['path']}"/>
											</notempty>  
										</div>
		                        </div>
		                    </div>
	                    </form>
	                </div>
	            </div>
	        </div>
        </div>
        <div class="row">
	        <div class="col-lg-12">
	        	<div class="ibox float-e-margins">
	                <div class="ibox-title">
	                    <h5>图标列表</h5>
	                    <div class="ibox-tools">
	                        <a class="collapse-link">
	                            <i class="fa fa-chevron-up"></i>
	                        </a>
	                    </div>
	                </div>
	                <div class="ibox-content">
		                <div class="wrapper wrapper-content animated fadeInRight">
					        <div class="row">
					        	<volist name="pictureInfo" id="vo">
					            <div class="col-lg-4">
					                <div class="contact-box">
					                    <a>
						                    <div class="col-sm-4">
						                        <div class="text-center">
						                            <img alt="image" class="img-square m-t-xs img-responsive" src="__ROOT__{$vo.path}	">
						                            <div class="m-t-xs font-bold">{$vo.name}</div>
						                        </div>
						                    </div>
						                    <div class="col-sm-8">
						                        <h3><strong>{$vo.name}</strong></h3>
						                        <p><i class="fa fa-map-marker"></i>是否显示：{$vo.type}</p>
						                        <address>
						                            {$vo.description}<br>
						                            <a class="btn btn-white btn-xs" href="{:U('Phoneindexicon/editPicShow?id='.$vo['id'])}">
														<i class="fa fa-pencil text-navy"></i>&nbsp;修改
													</a>
													<a class="btn btn-white btn-xs" href="{:U('Phoneindexicon/deletePicShow?id='.$vo['id'])}">
														<i class="fa fa-trash text-danger"></i>&nbsp;删除
													</a>
						                        </address>
						                    </div>
						                    <div class="clearfix"></div>
					                    </a>
					                </div>
					            </div>
					            </volist>
					        </div>
					    </div>
	                </div>
	            </div>
	        </div>
        </div>
    </div>

	<!-- 分页 -->
    <div class="page">
        {$_page}
    </div>  
</block>  
<block name="script">
	<script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
    <script type="text/javascript"> 
	    /* 初始化上传插件 */
		$("#upload_picture").uploadify({
	        "height"          : 30,
	        "swf"             : "__STATIC__/uploadify/uploadify.swf",
	        "fileObjName"     : "download",
	        "buttonText"      : "上传图标",
	        "uploader"        : "{:U('File/uploadPicture',array('session_id'=>session_id()))}",
	        "width"           : 120,
	        'removeTimeout'	  : 1,
	        'fileTypeExts'	  : '*.jpg; *.png; *.gif;',
	        "onUploadSuccess" : uploadPicture,
	        'onFallback' : function() {
	            alert('未检测到兼容版本的Flash.');
	        }
	    });
		function uploadPicture(file, data){
	    	var data = $.parseJSON(data);
	    	var src = ''; 
	        if(data.status){ 
	        	$("#icon").val(data.id); 
	        	src = data.url || '__ROOT__' + data.path 
	        	$("#icon").parent().find('.image').html( 
	        		'<img class="img-responsive" src="' + src + '"/>' 
	        	); 
	        	$("#path").val(data.path); 
	        } else {
	        	updateAlert(data.info);
	        	setTimeout(function(){ 
	                $(this).removeClass('disabled').prop('disabled',false);
	            },1500);
	        }
	    }
        $(document).ready(function(){
            $('.file-box').each(function() {
                animationHover(this, 'pulse');
            });
        });
        $(document).ready(function(){
            $('.contact-box').each(function() {
                animationHover(this, 'pulse');
            });
        });
	</script>	
</block>
